<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <title>Result</title>
</head>
<body>
<div id="app">
    <template>
        <el-table
                :data="tableData"
                style="width:100%"
               max-height="1000" >
            <el-table-column
                    prop="id"
                    label="id"
                    width="150">
            </el-table-column>
            <el-table-column
                    prop="raceName"
                    label="竞赛名称"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="trackName"
                    label="赛道名称e"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="raceStep"
                    label="竞赛阶段"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="studentName"
                    label="参赛学生"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="teacherName"
                    label="老师姓名"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="winDate"
                    label="获奖时间"
                    width="200">
            </el-table-column>
            <el-table-column
                    prop="level"
                    label="奖励等次"
                    width="150">
            </el-table-column>
            <el-table-column
                    prop="cert"
                    label="奖状"
                    width="300">
            </el-table-column>
        </el-table>
        <el-pagination
                background
                layout="prev, pager, next"
                :total="100"
                            >
        </el-pagination>
    </template>

</div>
</body>
<script src="https://unpkg.com/vue@2/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="js/axios-0.18.0.js"></script>
<script>
    new Vue({
        el: '#app',
        mounted(){
           this.show1()
        },
        data() {
            return {
                tableData:
                    [
                    {
                        id:'',
                        raceName: '',
                        trackName: '',
                        raceStep:'',
                        studentName: '',
                        teacherName: '',
                        winDate: '',
                        level:'',
                        cert: ''
                    }
                    ]
            };
        },
        methods: {
           show1(){
                console.log('submit!');
                var _this = this
                axios({
                    method:"get",
                    url:"http://localhost:8080/selectall",
                }).then(function (resp) {
                    _this.tableData = resp.data;
                })
            }
        }
    })
</script>
</html>